<style scoped lang="scss">
@import './index.scss';
</style>
<template>
  <Row class="video-realtime-row" style="min-height:80vh;">
    <!-- <Col :span="19" class="realtime-left-container">
    </Col>
    <Col :span="5" class="realtime-right-container">
    </Col> -->
    <iframe style="width:100%;height:800px;" id="iframe" ref="iframe" frameborder="0" scrolling="no" :src="src">
    </iframe>
  </Row>
</template>
<script>
import { getVideoParams } from '@/api'
import { haiKangWithBrowserTye, haiKangPluginExist } from '@/utils/check-browser'
export default {
  props: {
    type: {
      type: String,
      default: '1'
    }
  },
  data: () => ({
    id: '',
    baseInfo: {},
    src: ''
  }),
  mounted() {
    const { params } = this.$route
    this.id = params.id
    this.initData()
  },
  methods: {
    initData() {
      const params = {
        id: this.id
      }
      getVideoParams(params).then(res => {
        this.baseInfo = res.data.base
        const { deviceNo, heatDirectStream, videoDirectStream } = this.baseInfo
        if (this.type === 1) {
          if (deviceNo.startsWith('dl')) {
            this.src = heatDirectStream
          } else if (deviceNo.startsWith('hk')) {
            if (haiKangWithBrowserTye()) {
              haiKangPluginExist().then(flag => {
                if (flag) {
                  this.src =
                    'http://47.92.248.136:8090/openapi/demo/mpv/mpv.html'
                }
              })
            }
          }
        } else {
          if (deviceNo.startsWith('dl')) {
            this.src = videoDirectStream
          } else if (deviceNo.startsWith('hk')) {
            if (haiKangWithBrowserTye()) {
              haiKangPluginExist().then(flag => {
                if (flag) {
                  this.src =
                    'http://47.92.248.136:8090/openapi/demo/mpv/mpv.html'
                }
              })
            }
          }
        }
      })
    }
  }
}
</script>